<template>
  <div class="about">
    <!-- <el-button @click="getData">123</el-button> -->
    <Zhutu></Zhutu>
    <div class="info_back">
      <div class="info_box">
        <Card></Card>
        <Card></Card>
        <Card></Card>
      </div>
    </div>
    <AboutBox></AboutBox>
    <div class="honor">
      <HonorBox></HonorBox>
    </div>
    <FootBar></FootBar>
  </div>
</template>

<script>
import AboutBox from "../../components/AboutBox.vue";
import Card from "../../components/Card.vue";
import HonorBox from "../../components/HonorBox.vue";
import Zhutu from "../../components/Zhutu.vue";
import FootBar from "../../components/FootBar.vue";

// import request from "../../Api/request";
import { test } from '../../http/axios'

export default {
  data() {
    return {};
  },
  mounted(){
    this.getData()
  },
  methods: {
    getData(){
      console.log(123);
      // console.log(test({}))
      test({}).then(res => {
        console.log(res,11111);
      })
    }
    // async getData() {
    //   console.log(123123123)
    //   //  const res = await request.get('/?id=123')
    //    const res = await request.get('/')
    //   // const res = request.get("/");
    //   console.log(res,"-------------");
    // },
  },
  components: {
    Zhutu,
    Card,
    AboutBox,
    HonorBox,
    FootBar,
  },
};
</script>

<style scoped>
.about {
  width: 100%;
}
.info_back {
  height: 150px;
  width: 100%;
  display: flex;
  justify-content: center;
}
.info_box {
  display: flex;
  justify-content: space-between;
  width: 1000px;
  margin: 30px 0;
}
.honor {
  width: 100%;
  height: 350px;
  display: flex;
  justify-content: center;
}
</style>
